<template>
    <div>
    <!-- <el-dialog
      v-model="dialogVisible" 
      width="80%" 
      align-center 
      :before-close="cancel" 
      :close-on-click-modal="false" 
      :show-close="false" 
      :destroy-on-close="false&&true"
      append-to-body 
      draggable
    > -->
    <el-dialog
      v-model="dialogVisible" 
      width="80%" 
      align-center 
      :before-close="cancel" 
      :close-on-click-modal="false" 
      :show-close="false" 
      :destroy-on-close="false&&true"
      draggable
    >
        <template #header="{ close }">
          <div class="dialog-header flex justify-between items-center">
            <div>{{title}}</div>
            <el-icon class="el-icon--left cursor-pointer" @click="close"
              ><CircleCloseFilled color="#fff"
            /></el-icon>
          </div>
        </template>

        <div class="dialog-content">
          <div>
            <div style="position: relative;" v-if="opType==3&&form.processInstanceId">
              <!-- <a href="javascript:void(0)" @mouseover="showCheckLog=true;console.log(showCheckLog)" @mouseout="showCheckLog=false;console.log(showCheckLog)" style="margin:5px;position:absolute;color:#337ab7;top:5px;right:20px;z-index:999" v-if="opType==3">审核记录</a>
              <div v-if="opType==3&&!loading&&form.processInstanceId&&showCheckLog">
                <Checkcomponents :procInsId="form.processInstanceId" :isView="true" style="margin:5px;position:absolute;top:50px;right:60px;"/>
              </div> -->
              <el-popover placement="left-start" width=960>
                <template #reference>
                  <a style="margin:5px;position:absolute;color:#337ab7;top:5px;right:20px;z-index:999">审核记录</a>
                </template>
                <div v-if="opType==3&&!loading&&form.processInstanceId">
                  <Checkcomponents :procInsId="form.processInstanceId" :isView="true"/>
                </div>
              </el-popover>
            </div>

            <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick" v-if="opType==1||opType==3" style="position: relative;">
                <el-tab-pane label="机构信息" name="机构信息" v-if="!(getCurRole()==='biz_kyms'&&form.checkStatus==='2'&&opType==1)">
                  <UnitMainInfo ref='unitMainInfoCom' :opType="opType" v-model:opUnitInfo="form" @refreshUnitList="onRefreshUnitList" v-if="(opType==1||opType==3)&&activeName=='机构信息'&&form.id"/>
                </el-tab-pane>
                <el-tab-pane label="平台简介" name="平台简介">
                  <UnitSummaryInfo ref='unitSummaryInfoCom' :opType="opType" v-model:opUnitInfo="form" @refreshUnitList="onRefreshUnitList" v-if="(opType==1||opType==3)&&activeName=='平台简介'&&form.id"/>
                </el-tab-pane>
                <el-tab-pane label="规章制度" name="规章制度">
                  <Regulation ref='regulationCom' :opType="opType" v-model:opUnitInfo="form" @refreshUnitList="onRefreshUnitList" v-if="(opType==1||opType==3)&&activeName=='规章制度'&&form.id"/>
                </el-tab-pane>
                <el-tab-pane label="平台年报" name="平台年报">
                  <UnitAnnals ref='unitAnnalsCom' :opType="opType" v-model:opUnitInfo="form" @refreshUnitList="onRefreshUnitList" v-if="(opType==1||opType==3)&&activeName=='平台年报'&&form.id"/>
                </el-tab-pane>
                <el-tab-pane label="教育部统计" name="教育部统计">
                  <EducationStat ref='educationStatCom' :opType="opType" v-model:opUnitInfo="form" @refreshUnitList="onRefreshUnitList" v-if="(opType==1||opType==3)&&activeName=='教育部统计'&&form.id"/>
                </el-tab-pane>
            </el-tabs>
            <UnitMainInfo ref='unitMainInfoCom' :opType="opType" @refreshUnitList="onRefreshUnitList" v-else-if="opType==0"/>
            <UnitMainInfo ref='unitMainInfoCom' :opType="opType" @refreshUnitList="onRefreshUnitList" v-model:opUnitInfo="form" v-else-if="opType==2&&form.id"/>
          </div>
        </div>
        <div v-if="opType==2&&!loading&&form.processInstanceId" style="height:120px"></div>
        <template #footer>
          <div class="dialog-footer" >
            <div v-if="opType==2&&!loading&&form.processInstanceId">
              <Checkcomponents :procInsId="form.processInstanceId" @success="authorSuccess" style="padding:0px;margin-top:-6px;margin-bottom:0px;"/>
            </div>
            <div class="operate-btns">
              <el-button type="primary" @click="save" v-if="opType==0||opType==1">保 存</el-button>
              <el-button type="primary" @click="saveAndSubmit" v-if="(opType==0||opType==1)&&activeName=='机构信息'&&(getCurRole()==='biz_kyms'&&form.checkStatus!=='2'&&form.checkStatus!=='1')" v-hasRole="['biz_kyms']">保存并提交</el-button>
              <el-button type="primary" @click="saveAndPass" v-if="(opType==0||opType==1)&&activeName=='机构信息'&&(getCurRole()==='biz_kycgly'&&!loading&&form.checkStatus!=='2')" v-hasRole="['biz_kycgly']">保存并通过</el-button>
              <el-button @click="cancel" v-if="opType==0||opType==1||opType==3">关 闭</el-button>
            </div>
          </div>
        </template>
    </el-dialog>
    </div>
</template>

<script setup>
//import { defineProps, defineEmits, defineModel } from 'vue'
import useUserStore from '@/store/modules/user';
import UnitMainInfo from "./UnitMainInfo.vue";
import UnitSummaryInfo from "./UnitSummaryInfo.vue";
import Regulation from "./Regulation.vue";
import UnitAnnals from "./UnitAnnals.vue";
import EducationStat from "./EducationStat.vue";
import { listUnit, getUnit, delUnit, addUnit, updateUnit, getCurRole } from "@/api/research/unit";

import Checkcomponents from "@/views/flowable/processInstance/detail/components.vue"

const { proxy } = getCurrentInstance();

const data = reactive({
  form: {},
});

const { form, rules } = toRefs(data);

const activeName = ref("");
const title = ref("");
const unitMainInfoCom = ref(null);
const unitSummaryInfoCom = ref(null);
const regulationCom = ref(null);
const unitAnnalsCom = ref(null);
const educationStatCom = ref(null);
const loading = ref(true);

const dialogVisible = defineModel();
const emit = defineEmits(['refreshUnitList']);  

const props = defineProps({
  opType: {
    type: Number,
    required: true,
    default: 0    // 默认值  0:add 1:edit 2:check 3:view
  },
  opUnitId: {
    type: String, 
    default: null
  },
  // visible: {  
  //   type: Boolean,
  //   required: true,
  //   default: false  
  // },

//   //  更复杂的验证  
//   user: {  
//     type: Object,  
//     validator: (value) => {  
//       return value && value.name && value.age > 0  
//     }  
//   }
}) 

onMounted(() => {
  switch (props.opType) {
    case 0:
      title.value = "研究机构新增";
      break;
    case 1:
      title.value = "研究机构编辑";
      break;
    case 2:
      title.value = "研究机构审核";
      break;
    case 3:
      title.value = "研究机构查看";
      break;
    default:
      proxy.$modal.msgError("未知操作");
      return;
  }
  
  reset();

  if (props.opType > 0 && props.opUnitId) {
    getUnit(props.opUnitId).then(response => {
      form.value = response.data;
      loading.value = false;
      if(getCurRole()==='biz_kyms'&&form.value.checkStatus==='2'&&props.opType==1){
        activeName.value = "平台简介";
      } else {
        activeName.value = "机构信息";
      }
    });
  } else {
    loading.value = false;
    activeName.value = "机构信息";
  }
})

function handleClick() {
  
}

function onRefreshUnitList(notClose) {
  emit('refreshUnitList', notClose);
}

function authorSuccess(params) {
   cancel();
   
   onRefreshUnitList();
}

function dispatch(target) {
  if (props.opType === 0) {
    unitMainInfoCom.value[target]();
  } else if(props.opType === 1) {
    switch (activeName.value) {
      case '机构信息':
        unitMainInfoCom.value[target]();
        break;
      case '平台简介':
        unitSummaryInfoCom.value[target]();
        break;
      case '规章制度':
        regulationCom.value[target]();
        break;
      case '平台年报':
        unitAnnalsCom.value[target]();
        break;
      case '教育部统计':
        educationStatCom.value[target]();
        break;
      default:
        break;
    }
  }
}

//保存
function save() {
  dispatch("save")
}

//保存并提交
function saveAndSubmit() {
  dispatch("saveAndSubmit")
}

//保存并通过
function saveAndPass() {
  dispatch("saveAndPass")
}

// 关闭按钮
function cancel() {
  dispatch("cancel")
  dialogVisible.value = false;
  reset();

  // if(props.opType==2) {
  //   onRefreshUnitList();
  // }
}

// 表单重置
function reset() {
  form.value = {
    id: null,
    name: null,
    code: null,
    charger: null,
    contacts: null,
    hrUnitId: null,
    upUnitId: null,
    subjectClassId: null,
    subjectId: null,
    isSta: null,
    levelId: null,
    tel: null,
    fax: null,
    address: null,
    postalCode: null,
    email: null,
    website: null,
    fileIds: null,
    researchTypeId: null,
    approveDept: null,
    approveDate: null,
    isOpen: null,
    isCombined: null,
    techField: null,
    subjectField: null,
    intro: null,
    checkStatus: null,
    checkDate: null,
    checker: null,
    createUserId: null,
    lastEditUserId: null,
    createDate: null,
    lastEditDate: null,
    createUserName: null,
    lastEditUserName: null,
    contactsId: null,
    chargerId: null,
    unitCheckDate: null,
    unitCreateDate: null,
    platformSummary: null,
    unitId: null,
    prevEvaluateTime: null,
    prevEvaluateResult: null,
    completeDataStatus: null,
    processInstanceId: null
  };
  loading.value = true;
}
</script>

<style scoped lang="scss">
@import url("../index.scss");
:deep(.el-tabs__header) {
  padding: 0 10px;
  margin-bottom: 0;
  background: #fff;
}
</style>
